<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>自定义表明细</title>
        <#include "/pubHeadStyle.html">
        <script src="${ctx}/extends/jquery.min.js" type="text/javascript"></script>
    </head>
    <body>
        <form class="layui-form" action="" lay-filter="formData" style="height: 197px;overflow: auto">
            <fieldset class="layui-elem-field" style="border-color: #ccc;margin:10px;">
                <legend style="">主表${bpmFormTable.tableName}</legend>
            <input type="hidden" name="mainTableId" value="${bpmFormTable.tableId}" class="layui-input"/>
            <div class="layui-field-box">
                <div class="layui-form-item">
                    <div class="layui-inline">
                        <label class="layui-form-label" style="width: auto">原注释: </label>
                        <div class="layui-input-inline">
                            <input type="text" name="oldTableDesc" value="${bpmFormTable.tableDesc}" class="layui-input"
                                   placeholder="原注释" readonly/>
                        </div>
                    </div>
                    <div class="layui-inline">
                        <label class="layui-form-label" style="width: auto">新注释:<span style="color:red">*</span></label>
                        <div class="layui-input-inline">
                            <input type="text" name="newTableDesc" class="layui-input" lay-verify="required"
                                   placeholder="新注释" onblur="autoGetTableName(this)" required/>
                        </div>
                    </div>
                </div>
                <div class="layui-form-item">
                    <div class="layui-inline">
                        <label class="layui-form-label" style="width: auto">旧表名: </label>
                        <div class="layui-input-inline">
                            <input type="text" name="oldTableName" value="${bpmFormTable.tableName}" class="layui-input"
                                   placeholder="旧表名" readonly/>
                        </div>
                    </div>
                    <div class="layui-inline">
                        <label class="layui-form-label" style="width: auto">新表名:<span style="color:red">*</span></label>
                        <div class="layui-input-inline">
                            <input type="text" name="newTableName" class="layui-input" lay-verify="required"
                                   placeholder="新表名" required/>
                        </div>
                    </div>
                </div>
            </div>
            </fieldset>
            <#if isSubTable?? && (isSubTable=='true') >
               <#list bpmFormTable.subTableList as subTable>

            <div class="subTable">
                <fieldset class="layui-elem-field" style="border-color: #ccc;margin:10px;">
                    <legend>子表${subTable.tableName}</legend>
                <input type="hidden" name="subTableId" value="${subTable.tableId}" class="layui-input"/>
                <div class="layui-field-box">
                    <div class="layui-form-item">
                        <div class="layui-inline">
                            <label class="layui-form-label" style="width: auto">原注释: </label>
                            <div class="layui-input-inline">
                                <input type="text" name="oldSubTableDesc" value="${subTable.tableDesc}"
                                       class="layui-input" placeholder="原注释" readonly/>
                            </div>
                        </div>
                        <div class="layui-inline">
                            <label class="layui-form-label" style="width: auto">新注释:<span
                                    style="color:red">*</span></label>
                            <div class="layui-input-inline">
                                <input type="text" name="newSubTableDesc" class="layui-input" placeholder="新注释"
                                       lay-verify="required" onblur="autoGetSubTableName(this)"/>
                            </div>
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <div class="layui-inline">
                            <label class="layui-form-label" style="width: auto">旧表名: </label>
                            <div class="layui-input-inline">
                                <input type="text" name="oldSubTableName" value="${subTable.tableName}"
                                       class="layui-input" placeholder="旧表名" readonly/>
                            </div>
                        </div>
                        <div class="layui-inline">
                            <label class="layui-form-label" style="width: auto">新表名:<span
                                    style="color:red">*</span></label>
                            <div class="layui-input-inline">
                                <input type="text" name="newSubTableName" class="layui-input" placeholder="新表名"
                                       lay-verify="required"/>
                            </div>
                        </div>
                    </div>
                </div>
                </fieldset>
            </div>
        </#list>
    </#if>
        <div class="layui-btn-container" style="position: absolute;bottom: 0;left: 41%;">
            <p class="layui-btn" id="saveButton" lay-submit="" lay-filter="save">保存</p>
            <button class="layui-btn layui-btn-danger" id="return">取消</button>
        </div>
        </form>
        <style>
            #formData {
                height: 300px;
                overflow-y: auto;
            }
        </style>
        <script>
            var setter;
            var commons;
            layui.config({
                base: serverPath.formPath + staticPath.formPath //静态资源所在路径
            }).extend({
                index: 'index' //主入口模块
            }).use(['index', 'commons', 'setter', 'layer', 'jquery', 'form'], function () {
                var layer = layui.layer, $ = layui.$,form = layui.form;
                setter = layui.setter;
                commons = layui.commons;
                form.render();
                //关闭弹窗
                var index = parent.layer.getFrameIndex(window.name);
                $('#return').click(function () {
                    parent.layer.close(index);
                });
                var isSubTable = "${isSubTable}";
                //监听提交
                form.on('submit(save)', function (data) {
                    var jsonArray = new Array();
                    var mainTableId = $("input[name='mainTableId']").val();
                    var mainTableDesc = $("input[name='newTableDesc']").val();
                    var mainTableName = $("input[name='newTableName']").val();
                    var mainJson = {"tableId": mainTableId, "tableDesc": mainTableDesc, "tableName": mainTableName};
                    jsonArray.push(mainJson);
                    if (isSubTable == "true") {
                        $(".subTable").each(function (index, ele) {
                            var subTableId = $(ele).find("input[name='subTableId']").val();
                            var subTableDesc = $(ele).find("input[name='newSubTableDesc']").val();
                            var subTableName = $(ele).find("input[name='newSubTableName']").val();
                            var subJson = {"tableId": subTableId, "tableDesc": subTableDesc, "tableName": subTableName};
                            jsonArray.push(subJson);
                        });
                    }
                    $.ajax({
                        url: serverPath.formPath + setter.formLinkPath + 'table/saveCopy',
                        type: "post",
                        dataType: 'json',
                        data: {"json": JSON.stringify(jsonArray)},
                        success: function (result) {
                            if (commons._filterRecord(result)) {
                                layer.alert(result.msg, {skin: 'btn-class'}, function () {
                                    commons.bulletWindow(index);
                                    parent.layui.table.reload('customTable', {
                                        page: {
                                            curr: 1
                                        }
                                    });
                                    parent.layui.totalFilter.init('customTable');
                                });
                            } else {
                                layer.alert(result.msg, {skin: 'btn-class'});
                            }
                        }
                    });
                });
            })

            /**
             * 根据主表名描述生成主表名
             * @param inputObj
             */
            function autoGetTableName(inputObj) {
                var tableDesc = $(inputObj).val();
                if ($.trim(tableDesc).length < 1) return;
                $.ajax({
                    url: serverPath.formPath + setter.formLinkPath + "table/getFieldKey",
                    dataType: 'json',
                    data: ({fieldDesc: tableDesc}),
                    success: function (obj) {
                        if (commons._filterRecord(obj)) {
                            $("input[name='newTableName']").val(obj.data);
                        }
                    }
                });
            }
            /**
             * 根据子表名描述生成子表名
             * @param inputObj
             */
            function autoGetSubTableName(inputObj) {
                var tableDesc = $(inputObj).val();
                if ($.trim(tableDesc).length < 1) return;
                $.ajax({
                    url: serverPath.formPath + setter.formLinkPath + "table/getFieldKey",
                    dataType: 'json',
                    data: ({fieldDesc: tableDesc}),
                    success: function (obj) {
                        if (commons._filterRecord(obj)) {
                            $(inputObj).parent().parent().parent().next().find("input[name='newSubTableName']").val(obj.data);
                        }
                    }
                });
            }
        </script>
    </body>
</html>